<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" type="text/css" rel="stylesheet" media="all"> <div class="container-fluid"> <div class="col-md-12 col-sm-12 col-xs-12 text-center"> <p style="margin:0;">YOUR VOD IS JUST A CLICK AWAY !</p> </div> <div class="plans col-md-12 col-sm-12 col-xs-12 text-center"> <h5>Plans</h5> </div> </div><!--container-fluid close--> <section> <div class="container"> <div class="row"> <!-- item --> <div class="col-md-4 col-sm-4 col-xs-12 text-center"> <div class="panel panel-pricing"> <div class="panel-heading"> <i class="fa fa-windows"></i> <h3>Plan -1</h3> </div><!--panel-heading close--> <div class="panel-body text-center"> <p class="p-title">Subscription Duration</p><!--p-title close--> <p class="p-time">2 days - 30 Mins</p><!--p-time close--> </div><!--panel-body text-center close--> <div class="panel-body text-center"> <p class="p-price">₦ 50.00 </p><!--p-price close--> <p class="p-tax">All inclusive</p><!--p-tax close--> </div><!--panel-body text-center close--> <div class="panel-footer"> <a class="btn sub-btn" href="#">Subscribe Now</a> </div> </div><!--panel panel-pricing close--> </div><!--col-md-4 col-sm-4 col-xs-12 text-center close--> <div class="col-md-4 col-sm-4 col-xs-12 text-center"> <div class="panel panel-pricing"> <div class="panel-heading"> <i class="fa fa-windows"></i> <h3>Plan -2</h3> </div><!--panel-heading close--> <div class="panel-body text-center"> <p class="p-title">Subscription Duration</p><!--p-title close--> <p class="p-time">7 days - 90 Mins</p><!--p-time close--> </div><!--panel-body text-center close--> <div class="panel-body text-center"> <p class="p-price">₦ 150.00 </p><!--p-price close--> <p class="p-tax">All inclusive</p><!--p-tax close--> </div><!--panel-body text-center close--> <div class="panel-footer"> <a class="btn sub-btn" href="#">Subscribe Now</a> </div> </div><!--panel panel-pricing close--> </div><!--col-md-4 col-sm-4 col-xs-12 text-center close--> <div class="col-md-4 col-sm-4 col-xs-12 text-center"> <div class="panel panel-pricing"> <div class="panel-heading"> <i class="fa fa-windows"></i> <h3>Plan -3</h3> </div><!--panel-heading close--> <div class="panel-body text-center"> <p class="p-title">Subscription Duration</p><!--p-title close--> <p class="p-time">30 days - 250 Mins</p><!--p-time close--> </div><!--panel-body text-center close--> <div class="panel-body text-center"> <p class="p-price">₦ 400.00 </p><!--p-price close--> <p class="p-tax">All inclusive</p><!--p-tax close--> </div><!--panel-body text-center close--> <div class="panel-footer"> <a class="btn sub-btn" href="#">Subscribe Now</a> </div> </div><!--panel panel-pricing close--> </div><!--col-md-4 col-sm-4 col-xs-12 text-center close--> </div><!--row close--> </div><!--container close--> </section><!--section close-->

/*plans css*/ body { background:#efefef;} .plans {padding: 0 !important;} .plans h5 {background: #ed1c24;padding: 10px 10px;color: #fff;font-size: 16px;text-transform: uppercase; letter-spacing: 1px;font-weight: bold;} .panel-pricing {-moz-transition: all .3s ease;-o-transition: all .3s ease;-webkit-transition: all .3s ease;} .panel-pricing:hover {box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.2);} .panel-pricing .panel-heading {padding:13px 10px;color:#fdfdfd;background-color:#ed1c24;border-color:#ed1c24;} .panel-pricing .panel-heading .fa {margin-top: 10px;font-size: 58px;} .panel-pricing .list-group-item {color: #777777;border-bottom: 1px solid rgba(250, 250, 250, 0.5);} .panel { border:0px solid !important;} .panel-pricing .panel-body {font-size:40px;padding:10px;margin:0px;border-bottom: 1px solid #cfcfcf;} .panel-footer { border:0px solid !important;background-color:#fff !important;} .panel-pricing .panel-heading h3 {margin: 0;padding: 10px;} p.p-title { font-size:18px;text-align: center;text-transform: capitalize;} p.p-time { font-size:18px;text-align: center;text-transform: capitalize;} p.p-price { font-size:18px;text-align: center;text-transform: capitalize;color: #ed1c24;font-weight: bold;} p.p-tax { font-size:18px;text-align: center;text-transform: capitalize;} .sub-btn {background: #ed1c24;color: #fff;border-radius: 0px;padding: 5px 8px;} .sub-btn:hover, .sub-btn:focus { color:#fff; text-decoration:none;}